[iOS 10] SpriteKit の SKWarpGeometryGrid をさわってみた #1

[iOS 10] SpriteKit の SKWarpGeometryGrid をさわってみた #1

Clock Icon2016.11.07

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

今回は、SpriteKitSKWarpGeometryGrid を少しだけいじってみようと思います。
これを使うと、ひしゃげたり、伸びたり、縮んだりするアクションが簡単にできるようです。

まず、キャラを配置します。

warp_01_01

このキャラに、横に伸びて少しだけひしゃげる動きを付けてみます。

 
import SpriteKit
import GameplayKit

class GameScene: SKScene {
    
    private var penguin: SKSpriteNode!
    
    let sourcePositions = [
        float2(0, 0), float2(0.5, 0), float2(1, 0),
        float2(0, 0.5), float2(0.5, 0.5), float2(1, 0.5),
        float2(0, 1), float2(0.5, 1), float2(1, 1)
    ]
    
    let horizontalDestinationPositions = [
        float2(-0.5, 0), float2(0.5, 0.2), float2(1.5, 0),
        float2(-0.5, 0.5), float2(0.5, 0.5), float2(1.5, 0.5),
        float2(-0.5, 1), float2(0.5, 0.8), float2(1.5, 1)
    ]
    
    override func didMove(to view: SKView) {
        penguin = self.childNode(withName: "penguin") as! SKSpriteNode
    }
    
    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        let warpGrid = SKWarpGeometryGrid(columns: 2, rows: 2,
                                          sourcePositions: sourcePositions,
                                          destinationPositions: horizontalDestinationPositions)
        let noWarpGrid = SKWarpGeometryGrid(columns: 2, rows: 2)
        
        penguin.warpGeometry = noWarpGrid
        let warpAction = SKAction.animate(withWarps:[warpGrid, noWarpGrid], times: [0.25, 0.5])
        penguin.run(warpAction!)
        
    }
}

SKAction.animate で、グリッドの配列と変形時間の配列をセットするだけで簡単にアニメーションさせることができます。

では、動かしてみます。

warp_01_02

はい。ひしゃげました。

ごにょごにょと数値をセットしていますが、縦と横にそれぞれ2分割した座標を元に変形させることができるようです。
今回設定した値では、こんな感じにひしゃげさせています。
青字が変形前の sourcePositions で、緑字が変形後の horizontalDestinationPositions です。

warp_01_03

ではでは。

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.